<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>约数计算器</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
    <nav class="navbar navbar-default">
        <div class="container-fluid">
          <!-- Brand and toggle get grouped for better mobile display -->
          <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
              <span class="sr-only">Toggle navigation</span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">约数计算器</a>
          </div>
      
          
        </div><!-- /.container-fluid -->
      </nav>

      <div class="container">
          <div class="row">
              <h3>本系统可以查询1~10000之内所有数字的约束</h3>
          </div>
      </div>
      <p>请输入您要查询的数字</p>
      <p>
        <input type="number" class="form-control" id="number" >
      </p>
      <p>
        <button type="button" class="btn btn-success" id="btn">查询</button>
      </p>
      <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
      <script type="text/javascript">
        $("#btn").click(function(){
            var number = parseInt($("#number").val());
            if(number>1000000000){
              alert("阻断：数值过大！可能计算超时，请勿恶搞");
              return;
            } else if(number>100000000){
              alert("警告：数值过大！可能耗时过长");
            }
            window.location = "/" + number;
        })
      </script>
</body>
</html>